import { PlusOutlined } from '@ant-design/icons';

import styles from './style.less';
interface Props {
  onAdd?: any;
  title?: string;
  desc?: string;
  children?: any;
  isAdd?: boolean;
  isNew?: boolean;
}

const CardItem: React.FC<Props> = (props) => {
  const { children, onAdd = {}, title = '', desc = '', isAdd = false, isNew = false } = props;
  return (
    <div className={styles.card}>
      {/* 左上角标签 */}
      {isNew && <div className={styles.label} />}
      {isNew && <div className={styles.labelText}>新</div>}
      <h3>{title}</h3>
      {isAdd && (
        <p className={styles['card-add']} onClick={onAdd}>
          <PlusOutlined className={styles['icon-add']} />
          <span>{desc}</span>
        </p>
      )}
      {!isAdd && <p className={styles['card-content']}>{desc}</p>}
      {!isAdd && <div className={styles['card-bottom']}>{children}</div>}
    </div>
  );
};

export default CardItem;
